﻿@model SMEsCustomer360Degree.Models.ViewModels.CustomerManager.CustomerPortfolioViewModel
<div class="">
    <div class="row">
        <div class="col-md-12">
            <div class="x_panel">
                <div class="x_content">
                    @Html.Action("SubMenuCustomer", "System")
                    <!-- start accordion -->
                    <div class="accordion cm-accordion" id="accordion" role="tablist" aria-multiselectable="true">
                        @if (Model.listGroupRecord.Count == 0)
                        {
                            <h2>@SMEsCustomer360Degree.Core.Resources.Resource.MessNoCust</h2>
                        }
                        else
                        {
                            <!--Modal info customer -->
                            <div class="modal fade cm-cp-customer-info" tabindex="-1" role="dialog" aria-hidden="true">
                                <div class="modal-dialog modal-sm">
                                    <div class="modal-content">
                                        <div class="modal-header">
                                            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                                <span aria-hidden="true">×</span>
                                            </button>
                                        </div>
                                        <div class="modal-body">
                                            <div class="col-md-12 profile_details">
                                                <div class="well profile_view">
                                                    <div class="col-sm-12">
                                                        <h2 id="cust_info_name"></h2>
                                                        <p><strong>@SMEsCustomer360Degree.Core.Resources.Resource.IndustryHeader: </strong> <span id="cust_info_industry"></span> </p>
                                                        <ul class="list-unstyled">
                                                            <li><i class="fa fa-building"></i> <strong>@SMEsCustomer360Degree.Core.Resources.Resource.AddressHeader: </strong> <span id="cust_info_address"></span> </li>
                                                            <li><i class="fa fa-envelope"></i> <strong>Email : </strong><span id="cust_info_email"></span></li>
                                                            <li><i class="fa fa-phone"></i> <strong>Office : </strong><span id="cust_info_office"></span></li>
                                                            <li><i class="fa fa-phone"></i> <strong>Land Line : </strong><span id="cust_info_landline"></span></li>
                                                            <li><i class="fa fa-mobile"></i> <strong>Phone : </strong> <span id="cust_info_phone"></span></li>
                                                            <li><i class="fa fa-fax"></i> <strong>Fax : </strong> <span id="cust_info_fax"></span></li>
                                                        </ul>
                                                    </div>
                                                    <div class="col-xs-12 bottom text-center">
                                                        <div class="col-xs-12 col-sm-6 emphasis">
                                                            <button type="button" class="btn btn-primary btn-xs">
                                                                <i class="fa fa-user"> </i> @SMEsCustomer360Degree.Core.Resources.Resource.ViewDetailLbl
                                                            </button>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="modal-footer">
                                            @*<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>*@
                                        </div>
                                    </div>
                                </div>
                            </div>
                                            <!-- /modals -->
                        }
                        @foreach (var item in Model.listGroupRecord)
                        {
                            switch (item.GroupCode)
                            {
                                case "deposit":
                                    <div class="panel">
                                        <div class="panel-heading collapsed">
                                            <a role="tab" id="headingOne-@item.GroupCode" data-toggle="collapse" data-parent="#accordion" href="#collapseOne-@item.GroupCode" aria-expanded="false" aria-controls="collapseOne-@item.GroupCode">
                                                <h4 class="panel-title cm_cp_gr_general_lbl">@SMEsCustomer360Degree.Core.Resources.Resource.GrDeposit</h4>
                                            </a>
                                            <span id="total-@item.GroupCode-lbl" class="panel-title cm_cp_gr_lbl_total">@SMEsCustomer360Degree.Core.Resources.Resource.TotalLbl (@item.TotalCustomer)</span>
                                            <span id="new-@item.GroupCode-lbl" class="panel-title cm_cp_gr_lbl_new">@SMEsCustomer360Degree.Core.Resources.Resource.NewLbl (@item.NewCustomerByRule)</span>
                                            <a data-toggle="modal" data-target=".cm-cp-@item.GroupCode-modal" class="cm_cp_gr_lbl_new"><i class="fa fa-question-circle" data-toggle="tooltip" data-placement="top" title="" data-original-title="@SMEsCustomer360Degree.Core.Resources.Resource.TipForNewCustDeposit"></i></a>
                                        </div>
                                        <!-- Small modal -->

                                        <div class="modal fade cm-cp-@item.GroupCode-modal" tabindex="-1" role="dialog" aria-hidden="true">
                                            <div class="modal-dialog modal-sm">
                                                <div class="modal-content">
                                                    <div class="modal-header">
                                                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                                            <span aria-hidden="true">×</span>
                                                        </button>
                                                        <h4 class="modal-title" id="myModalLabel2">@SMEsCustomer360Degree.Core.Resources.Resource.TipForNewCustDeposit</h4>
                                                    </div>
                                                    <div class="modal-body">
                                                        <h4>@SMEsCustomer360Degree.Core.Resources.Resource.TipForNewCustDepositTextHeader</h4>
                                                        <p>@SMEsCustomer360Degree.Core.Resources.Resource.TipForNewCustDepositTextContent</p>
                                                    </div>
                                                    <div class="modal-footer">
                                                        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <!-- /modals -->
                                        <div id="collapseOne-@item.GroupCode" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingOne" aria-expanded="false" style="height: 0px;">
                                            <div class="panel-body">
                                                <div class="col-md-9">
                                                    <div class="col-md-6 cm-search-box">
                                                        <div class="col-md-5">
                                                            <select class="search_column_@item.GroupCode form-control" tabindex="-1" required>
                                                                <option></option>
                                                            </select>
                                                            <ul class="parsley-errors-list filled" id="parsley_search_column_@item.GroupCode" style="display:none;">
                                                                <li class="parsley-required">@SMEsCustomer360Degree.Core.Resources.Resource.MessRequiredField</li>
                                                            </ul>
                                                        </div>
                                                        <div class="col-md-7">
                                                            <input id="deposit_search_textbox" type="text" class="cm_search_textbox form-control" placeholder="Default Input">
                                                        </div>
                                                    </div>
                                                    <table id="cm-customer-portfolio-@item.GroupCode" class="table table-bordered table-striped jambo_table">
                                                        <thead class="headings">
                                                            <tr>
                                                                <th class="column-title">@SMEsCustomer360Degree.Core.Resources.Resource.CifHeader</th>
                                                                <th class="column-title">@SMEsCustomer360Degree.Core.Resources.Resource.NameHeader</th>
                                                                <th class="column-title">@SMEsCustomer360Degree.Core.Resources.Resource.IndustryHeader</th>
                                                                <th class="column-title">@SMEsCustomer360Degree.Core.Resources.Resource.DateOpenCifHeader</th>
                                                                <th class="column-title">@SMEsCustomer360Degree.Core.Resources.Resource.BalanceHeader</th>
                                                                <th class="column-title">@SMEsCustomer360Degree.Core.Resources.Resource.InfoHeader</th>
                                                            </tr>
                                                        </thead>
                                                        <tbody></tbody>
                                                    </table>
                                                </div>
                                                <div class="col-md-3">
                                                    <div class="x_panel">
                                                        <div class="x_title">
                                                            <h2>@SMEsCustomer360Degree.Core.Resources.Resource.FilterLbl</h2>
                                                            <div class="clearfix"></div>
                                                        </div>
                                                        <div class="x_content">
                                                            <div class="col-md-12">
                                                                <label>
                                                                    @SMEsCustomer360Degree.Core.Resources.Resource.FilterGroup
                                                                </label>
                                                                <select class="select2_group_@item.GroupCode form-control" tabindex="-1" required>
                                                                    <option></option>
                                                                </select>
                                                                <label>
                                                                    @SMEsCustomer360Degree.Core.Resources.Resource.FilterElement
                                                                </label>
                                                                <select class="select2_group_element_@item.GroupCode form-control" tabindex="-1" multiple="multiple" required>
                                                                    <option></option>
                                                                </select>
                                                                @*<input type="text" id="range_25" value="" name="range" />*@
                                                                <div class="ln_solid"></div>
                                                            </div>
                                                            <div class="col-md-9 col-sm-9 col-xs-12 col-md-offset-3">
                                                                <button id="filter-deposit" type="submit" class="btn btn-success">@SMEsCustomer360Degree.Core.Resources.Resource.FilterBtn</button>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    break;
                                case "loan":
                                <div class="panel">
                                    <div class="panel-heading collapsed">
                                        <a role="tab" id="headingOne-@item.GroupCode" data-toggle="collapse" data-parent="#accordion" href="#collapseOne-@item.GroupCode" aria-expanded="false" aria-controls="collapseOne-@item.GroupCode">
                                            <h4 class="panel-title cm_cp_gr_general_lbl">@SMEsCustomer360Degree.Core.Resources.Resource.GrLoan</h4>
                                        </a>
                                        <span id="total-@item.GroupCode-lbl" class="panel-title cm_cp_gr_lbl_total">@SMEsCustomer360Degree.Core.Resources.Resource.TotalLbl (@item.TotalCustomer)</span>
                                        <span id="new-@item.GroupCode-lbl" class="panel-title cm_cp_gr_lbl_new">@SMEsCustomer360Degree.Core.Resources.Resource.NewLbl (@item.NewCustomerByRule)</span>
                                        <a data-toggle="modal" data-target=".cm-cp-@item.GroupCode-modal" class="cm_cp_gr_lbl_new"><i class="fa fa-question-circle" data-toggle="tooltip" data-placement="top" title="" data-original-title="@SMEsCustomer360Degree.Core.Resources.Resource.TipForNewCustLoan"></i></a>
                                    </div>
                                    <!-- Small modal -->

                                    <div class="modal fade cm-cp-@item.GroupCode-modal" tabindex="-1" role="dialog" aria-hidden="true">
                                        <div class="modal-dialog modal-sm">
                                            <div class="modal-content">
                                                <div class="modal-header">
                                                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                                        <span aria-hidden="true">×</span>
                                                    </button>
                                                    <h4 class="modal-title" id="myModalLabel2">@SMEsCustomer360Degree.Core.Resources.Resource.TipForNewCustLoanTextHeader</h4>
                                                </div>
                                                <div class="modal-body">
                                                    <p>@SMEsCustomer360Degree.Core.Resources.Resource.TipForNewCustLoanTextContent</p>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <!-- /modals -->
                                    <!-- Small modal -->

                                    <div class="modal fade cm-cp-new-lending-detail" tabindex="-1" role="dialog" aria-hidden="true">
                                        <div class="modal-dialog modal-lg">
                                            <div class="modal-content">
                                                <div class="modal-header">
                                                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                                        <span aria-hidden="true">×</span>
                                                    </button>
                                                </div>
                                                <div class="modal-body">
                                                    <table id="cm-cp-tb-new-lending-detail" class="table table-bordered table-striped jambo_table">
                                                        <thead class="headings">
                                                            <tr>
                                                                <th class="column-title">CIF</th>
                                                                <th class="column-title">CUSTOMER NAME</th>
                                                                <th class="column-title">CHUONG TRINH SP</th>
                                                                <th class="column-title">DIST DATE</th>
                                                                <th class="column-title">ACCTNO</th>
                                                                <th class="column-title">BALANCE</th>
                                                            </tr>
                                                        </thead>
                                                        <tbody></tbody>
                                                    </table>
                                                </div>
                                                <div class="modal-footer">
                                                    <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <!-- /modals -->
                                    <div id="collapseOne-@item.GroupCode" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingOne" aria-expanded="false" style="height: 0px;">
                                        <div class="panel-body">
                                            <div class="col-md-12">
                                                <div class="col-md-9">
                                                    <div class="col-md-6 cm-search-box">
                                                        <div class="col-md-5">
                                                            <select class="search_column_@item.GroupCode form-control" tabindex="-1" required>
                                                                <option></option>
                                                            </select>
                                                            <ul class="parsley-errors-list filled" id="parsley_search_column_@item.GroupCode" style="display:none;">
                                                                <li class="parsley-required">@SMEsCustomer360Degree.Core.Resources.Resource.MessRequiredField</li>
                                                            </ul>
                                                        </div>
                                                        <div class="col-md-7">
                                                            <input id="loan_search_textbox" type="text" class="cm_search_textbox form-control" placeholder="Default Input">
                                                        </div>
                                                    </div>
                                                    <table id="cm-customer-portfolio-@item.GroupCode" class="table table-bordered table-striped jambo_table">
                                                        <thead class="headings">
                                                            <tr>
                                                                <th class="column-title">@SMEsCustomer360Degree.Core.Resources.Resource.CifHeader</th>
                                                                <th class="column-title">@SMEsCustomer360Degree.Core.Resources.Resource.NameHeader</th>
                                                                <th class="column-title">@SMEsCustomer360Degree.Core.Resources.Resource.IndustryHeader</th>
                                                                <th class="column-title">@SMEsCustomer360Degree.Core.Resources.Resource.DateOpenCifHeader</th>
                                                                <th class="column-title">@SMEsCustomer360Degree.Core.Resources.Resource.BalanceHeader</th>
                                                                <th class="column-title">@SMEsCustomer360Degree.Core.Resources.Resource.InfoHeader</th>
                                                            </tr>
                                                        </thead>
                                                        <tbody></tbody>
                                                    </table>
                                                </div>

                                                <div class="col-md-3">
                                                    <div class="x_panel">
                                                        <div class="x_title">
                                                            <h2>Form Basic Elements</h2>
                                                            <div class="clearfix"></div>
                                                        </div>
                                                        <div class="x_content">
                                                            <div class="">
                                                                <label>
                                                                    Choose type
                                                                </label>
                                                                <select class="select2_group_@item.GroupCode form-control" tabindex="-1" required>
                                                                    <option></option>
                                                                </select>
                                                                <label>
                                                                    Choose element
                                                                </label>
                                                                <select class="select2_group_element_@item.GroupCode form-control" tabindex="-1" multiple="multiple" required>
                                                                    <option></option>
                                                                </select>
                                                            </div>
                                                            <div class="ln_solid"></div>
                                                            <div class="col-md-9 col-sm-9 col-xs-12 col-md-offset-3">
                                                                <button id="filter-loan" type="submit" class="btn btn-success">Submit</button>
                                                            </div>

                                                        </div>
                                                    </div>
                                                </div>
                                            </div>

                                        </div>
                                    </div>
                                </div>
                                    break;
                                case "card":
                                <div class="panel">
                                    <div class="panel-heading collapsed">
                                        <a role="tab" id="headingOne-@item.GroupCode" data-toggle="collapse" data-parent="#accordion" href="#collapseOne-@item.GroupCode" aria-expanded="false" aria-controls="collapseOne-@item.GroupCode">
                                            <h4 class="panel-title cm_cp_gr_general_lbl">@SMEsCustomer360Degree.Core.Resources.Resource.GrCard</h4>
                                        </a>
                                        <span id="total-@item.GroupCode-lbl" class="panel-title cm_cp_gr_lbl_total">@SMEsCustomer360Degree.Core.Resources.Resource.TotalLbl (@item.TotalCustomer)</span>
                                        <span id="new-@item.GroupCode-lbl" class="panel-title cm_cp_gr_lbl_new">@SMEsCustomer360Degree.Core.Resources.Resource.NewLbl (@item.NewCustomerByRule)</span>
                                        <a data-toggle="modal" data-target=".cm-cp-@item.GroupCode-modal" class="cm_cp_gr_lbl_new"><i class="fa fa-question-circle" data-toggle="tooltip" data-placement="top" title="" data-original-title="@SMEsCustomer360Degree.Core.Resources.Resource.TipForNewCustCard"></i></a>
                                    </div>
                                    <!-- Small modal -->

                                    <div class="modal fade cm-cp-@item.GroupCode-modal" tabindex="-1" role="dialog" aria-hidden="true">
                                        <div class="modal-dialog modal-sm">
                                            <div class="modal-content">
                                                <div class="modal-header">
                                                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                                        <span aria-hidden="true">×</span>
                                                    </button>
                                                    <h4 class="modal-title" id="myModalLabel2">@SMEsCustomer360Degree.Core.Resources.Resource.TipForNewCustCard</h4>
                                                </div>
                                                <div class="modal-body">
                                                    <h4>Text in a modal</h4>
                                                    <p>Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.</p>
                                                    <p>Aenean lacinia bibendum nulla sed consectetur. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Donec sed odio dui. Donec ullamcorper nulla non metus auctor fringilla.</p>
                                                </div>
                                                <div class="modal-footer">
                                                    <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <!-- /modals -->
                                    <div id="collapseOne-@item.GroupCode" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingOne" aria-expanded="false" style="height: 0px;">
                                        <div class="panel-body">
                                            <div class="col-md-12">
                                            </div>
                                            <div class="col-md-12">
                                                <div class="col-md-6 cm-search-box">
                                                    <div class="col-md-5">
                                                        <select class="search_column_@item.GroupCode form-control" tabindex="-1" required>
                                                            <option></option>
                                                        </select>
                                                        <ul class="parsley-errors-list filled" id="parsley_search_column_@item.GroupCode" style="display:none;">
                                                            <li class="parsley-required">@SMEsCustomer360Degree.Core.Resources.Resource.MessRequiredField</li>
                                                        </ul>
                                                    </div>
                                                    <div class="col-md-7">
                                                        <input id="card_search_textbox" type="text" class="cm_search_textbox form-control" placeholder="Default Input">
                                                    </div>
                                                </div>
                                                <table id="cm-customer-portfolio-@item.GroupCode" class="table table-bordered table-striped jambo_table">
                                                    <thead class="headings">
                                                        <tr>
                                                            <th class="column-title">@SMEsCustomer360Degree.Core.Resources.Resource.CifHeader</th>
                                                            <th class="column-title">@SMEsCustomer360Degree.Core.Resources.Resource.NameHeader</th>
                                                            <th class="column-title">@SMEsCustomer360Degree.Core.Resources.Resource.IndustryHeader</th>
                                                            <th class="column-title">@SMEsCustomer360Degree.Core.Resources.Resource.DateOpenCifHeader</th>
                                                            <th class="column-title">@SMEsCustomer360Degree.Core.Resources.Resource.CardDebitHeader</th>
                                                            <th class="column-title">@SMEsCustomer360Degree.Core.Resources.Resource.CardCreditHeader</th>
                                                            <th class="column-title">@SMEsCustomer360Degree.Core.Resources.Resource.BalanceCreditHeader</th>
                                                            <th class="column-title">@SMEsCustomer360Degree.Core.Resources.Resource.InfoHeader</th>
                                                        </tr>
                                                    </thead>
                                                    <tbody></tbody>
                                                </table>
                                            </div>

                                        </div>
                                    </div>
                                </div>
                                    break;
                                case "i2b":
                                <div class="panel">
                                    <div class="panel-heading collapsed">
                                        <a role="tab" id="headingOne-@item.GroupCode" data-toggle="collapse" data-parent="#accordion" href="#collapseOne-@item.GroupCode" aria-expanded="false" aria-controls="collapseOne-@item.GroupCode">
                                            <h4 class="panel-title cm_cp_gr_general_lbl">@SMEsCustomer360Degree.Core.Resources.Resource.GrI2B</h4>
                                        </a>
                                        <span id="total-@item.GroupCode-lbl" class="panel-title cm_cp_gr_lbl_total">@SMEsCustomer360Degree.Core.Resources.Resource.TotalLbl (@item.TotalCustomer)</span>
                                        <span id="new-@item.GroupCode-lbl" class="panel-title cm_cp_gr_lbl_new">@SMEsCustomer360Degree.Core.Resources.Resource.NewLbl (@item.NewCustomerByRule)</span>
                                        <a data-toggle="modal" data-target=".cm-cp-@item.GroupCode-modal" class="cm_cp_gr_lbl_new"><i class="fa fa-question-circle" data-toggle="tooltip" data-placement="top" title="" data-original-title="@SMEsCustomer360Degree.Core.Resources.Resource.TipForNewCustI2B"></i></a>
                                    </div>
                                    <!-- Small modal -->

                                    <div class="modal fade cm-cp-@item.GroupCode-modal" tabindex="-1" role="dialog" aria-hidden="true">
                                        <div class="modal-dialog modal-sm">
                                            <div class="modal-content">
                                                <div class="modal-header">
                                                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                                        <span aria-hidden="true">×</span>
                                                    </button>
                                                    <h4 class="modal-title" id="myModalLabel2">@SMEsCustomer360Degree.Core.Resources.Resource.TipForNewCustI2B</h4>
                                                </div>
                                                <div class="modal-body">
                                                    <h4>@SMEsCustomer360Degree.Core.Resources.Resource.TipForNewCustI2BTextHeader</h4>
                                                    <p>@SMEsCustomer360Degree.Core.Resources.Resource.TipForNewCustI2BTextContent</p>
                                                </div>
                                                <div class="modal-footer">
                                                    <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <!-- /modals -->
                                    <div id="collapseOne-@item.GroupCode" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingOne" aria-expanded="false" style="height: 0px;">
                                        <div class="panel-body">
                                            <div class="col-md-12">
                                            </div>
                                            <div class="col-md-12">
                                                <div class="col-md-6 cm-search-box">
                                                    <div class="col-md-5">
                                                        <select class="search_column_@item.GroupCode form-control" tabindex="-1" required>
                                                            <option></option>
                                                        </select>
                                                        <ul class="parsley-errors-list filled" id="parsley_search_column_@item.GroupCode" style="display:none;">
                                                            <li class="parsley-required">@SMEsCustomer360Degree.Core.Resources.Resource.MessRequiredField</li>
                                                        </ul>
                                                    </div>
                                                    <div class="col-md-7">
                                                        <input id="i2b_search_textbox" type="text" class="cm_search_textbox form-control" placeholder="Default Input">
                                                    </div>
                                                </div>
                                                <table id="cm-customer-portfolio-@item.GroupCode" class="table table-bordered table-striped jambo_table">
                                                    <thead class="headings">
                                                        <tr>
                                                            <th class="column-title">@SMEsCustomer360Degree.Core.Resources.Resource.CifHeader</th>
                                                            <th class="column-title">@SMEsCustomer360Degree.Core.Resources.Resource.NameHeader</th>
                                                            <th class="column-title">@SMEsCustomer360Degree.Core.Resources.Resource.IndustryHeader</th>
                                                            <th class="column-title">@SMEsCustomer360Degree.Core.Resources.Resource.DateOpenCifHeader</th>
                                                            <th class="column-title">@SMEsCustomer360Degree.Core.Resources.Resource.NoUserI2bHeader</th>
                                                            <th class="column-title">@SMEsCustomer360Degree.Core.Resources.Resource.InfoHeader</th>
                                                        </tr>
                                                    </thead>
                                                    <tbody></tbody>
                                                </table>
                                            </div>
                                            <!-- Small modal -->

                                            <div class="modal fade cm-cp-@item.GroupCode-detail" tabindex="-1" role="dialog" aria-hidden="true">
                                                <div class="modal-dialog modal-sm">
                                                    <div class="modal-content">
                                                        <div class="modal-header">
                                                            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                                                <span aria-hidden="true">×</span>
                                                            </button>
                                                        </div>
                                                        <div class="modal-body">
                                                            <table id="cm-cp-tb-@item.GroupCode-detail" class="table table-bordered table-striped jambo_table">
                                                                <thead class="headings">
                                                                    <tr>
                                                                        <th class="column-title">CIF</th>
                                                                        <th class="column-title">USERNAME</th>
                                                                        <th class="column-title">STATUS</th>
                                                                    </tr>
                                                                </thead>
                                                                <tbody></tbody>
                                                            </table>
                                                        </div>
                                                        <div class="modal-footer">
                                                            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                            <!-- /modals -->
                                        </div>
                                    </div>
                                </div>
                                    break;
                                case "pos":
                                <div class="panel">
                                    <div class="panel-heading collapsed">
                                        <a role="tab" id="headingOne-@item.GroupCode" data-toggle="collapse" data-parent="#accordion" href="#collapseOne-@item.GroupCode" aria-expanded="false" aria-controls="collapseOne-@item.GroupCode">
                                            <h4 class="panel-title cm_cp_gr_general_lbl">@SMEsCustomer360Degree.Core.Resources.Resource.GrPos</h4>
                                        </a>
                                        <span id="total-@item.GroupCode-lbl" class="panel-title cm_cp_gr_lbl_total">@SMEsCustomer360Degree.Core.Resources.Resource.TotalLbl (@item.TotalCustomer)</span>
                                        <span id="new-@item.GroupCode-lbl" class="panel-title cm_cp_gr_lbl_new">@SMEsCustomer360Degree.Core.Resources.Resource.NewLbl (@item.NewCustomerByRule)</span>
                                        <a data-toggle="modal" data-target=".cm-cp-@item.GroupCode-modal" class="cm_cp_gr_lbl_new"><i class="fa fa-question-circle" data-toggle="tooltip" data-placement="top" title="" data-original-title="@SMEsCustomer360Degree.Core.Resources.Resource.TipForNewCustPos"></i></a>
                                    </div>
                                    <!-- Small modal -->

                                    <div class="modal fade cm-cp-@item.GroupCode-modal" tabindex="-1" role="dialog" aria-hidden="true">
                                        <div class="modal-dialog modal-sm">
                                            <div class="modal-content">
                                                <div class="modal-header">
                                                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                                        <span aria-hidden="true">×</span>
                                                    </button>
                                                    <h4 class="modal-title" id="myModalLabel2">@SMEsCustomer360Degree.Core.Resources.Resource.TipForNewCustPos</h4>
                                                </div>
                                                <div class="modal-body">
                                                    <h4>@SMEsCustomer360Degree.Core.Resources.Resource.TipForNewCustPosTextHeader</h4>
                                                    <p>@SMEsCustomer360Degree.Core.Resources.Resource.TipForNewCustPosTextContent</p>
                                                </div>
                                                <div class="modal-footer">
                                                    <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <!-- /modals -->
                                    <div id="collapseOne-@item.GroupCode" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingOne" aria-expanded="false" style="height: 0px;">
                                        <div class="panel-body">
                                            <div class="col-md-12">
                                            </div>
                                            <div class="col-md-12">
                                                <div class="col-md-6 cm-search-box">
                                                    <div class="col-md-5">
                                                        <select class="search_column_@item.GroupCode form-control" tabindex="-1" required>
                                                            <option></option>
                                                        </select>
                                                        <ul class="parsley-errors-list filled" id="parsley_search_column_@item.GroupCode" style="display:none;">
                                                            <li class="parsley-required">@SMEsCustomer360Degree.Core.Resources.Resource.MessRequiredField</li>
                                                        </ul>
                                                    </div>
                                                    <div class="col-md-7">
                                                        <input id="pos_search_textbox" type="text" class="cm_search_textbox form-control" placeholder="Default Input">
                                                    </div>
                                                </div>
                                                <table id="cm-customer-portfolio-@item.GroupCode" class="table table-bordered table-striped jambo_table">
                                                    <thead class="headings">
                                                        <tr>
                                                            <th class="column-title">@SMEsCustomer360Degree.Core.Resources.Resource.CifHeader</th>
                                                            <th class="column-title">@SMEsCustomer360Degree.Core.Resources.Resource.NameHeader</th>
                                                            <th class="column-title">@SMEsCustomer360Degree.Core.Resources.Resource.IndustryHeader</th>
                                                            <th class="column-title">@SMEsCustomer360Degree.Core.Resources.Resource.DateOpenCifHeader</th>
                                                            <th class="column-title">@SMEsCustomer360Degree.Core.Resources.Resource.NoPosHeader</th>
                                                            <th class="column-title">@SMEsCustomer360Degree.Core.Resources.Resource.TransactionHeader</th>
                                                            <th class="column-title">@SMEsCustomer360Degree.Core.Resources.Resource.InfoHeader</th>
                                                        </tr>
                                                    </thead>
                                                    <tbody></tbody>
                                                </table>
                                            </div>

                                        </div>
                                    </div>
                                </div>
                                    break;
                                default:
                                    break;
                            }
                        }
                    </div>
                    <!-- end of accordion -->
                </div>
            </div>
        </div>
    </div>
</div>
@section scripts
{
    @foreach (var item in Model.listGroupRecord)
    {
        switch (item.GroupCode)
        {
            case "deposit":
                <script type="text/javascript">
                    $(document).ready(function () {
                        $('#total-@item.GroupCode-lbl').click(function () {
                            $('#collapseOne-@item.GroupCode').collapse('show');
                        });
                        $('#new-@item.GroupCode-lbl').click(function () {
                            $('#collapseOne-@item.GroupCode').collapse('show');
                        });
                        $('#filter-deposit').click(function () {
                            var table_filter = $('#cm-customer-portfolio-@item.GroupCode').DataTable({
                                //"order": [[0, 'asc']],
                                "bServerSide": true,
                                "bProcessing": true,
                                "responsive": true,
                                "bAutoWidth": false,
                                "aLengthMenu": [10, 30, 50, 100],
                                "pageLength": 10,
                                "sAjaxSource": '@Url.Action("CustomerPortfolioData","CustomerManager")' + '?type=@item.GroupCode&group=' + $(".select2_group_@item.GroupCode").val() + '&grouptype=' + $(".select2_group_element_@item.GroupCode").val(),
                                "fnServerData": function (sSource, aoData, fnCallback) {
                                    $.ajax({
                                        "dataType": 'json',
                                        "type": "POST",
                                        "url": sSource,
                                        "data": aoData,
                                        "success": fnCallback
                                    });
                                },
                                "sDom": "<'row-fluid'<'span6'l><'span6'f>r>t<'row-fluid'<'dataTables_wrapper'ip>>",
                                "sPaginationType": "simple_numbers",//"full_numbers",
                                destroy: true,
                                "aoColumns": [
                                            { "sName": "CIF", "bSortable": false },
                                        { "sName": "NAME", "bSortable": false },
                                        { "sName": "VPB INDUSTRY", "bSortable": false },
                                        { "sName": "DATE OPEN CIF", "bSortable": false },
                                        { "sName": "BALANCE", "bSortable": false },
                                        { "sName": "INFO", "bSortable": false }],
                                "aoColumnDefs": [{
                                    "aTargets": [5],
                                    "mRender": function (data, type, full) {
                                        return '<a class=\"btn btn-primary btn-xs\" onclick=\"showCustomerInfo(\'' + full[0] + '\');\"><i class="fa fa-info"></i></a>';
                                    }
                                }]
                            });
                            table_filter.columns().every(function () {
                                var that = this;

                                $('#deposit_search_textbox').on('keyup change', function () {
                                    if ($(".search_column_@item.GroupCode").val() == "") {
                                        $("#parsley_search_column_@item.GroupCode").show();
                                        this.value = "";
                                    } else {
                                        if (that.index() == $(".search_column_@item.GroupCode").val()) {
                                            that.search(this.value).draw();
                                        }
                                    }

                                });
                                $(".search_column_@item.GroupCode").on("change", function (e) {
                                    $("#parsley_search_column_@item.GroupCode").hide();
                                    $('#deposit_search_textbox').val('');
                                    that.search('').draw();
                                });
                            });
                        });
                        var table = $('#cm-customer-portfolio-@item.GroupCode').DataTable({
                            //"order": [[0, 'asc']],
                            "bServerSide": true,
                            "bProcessing": true,
                            "responsive": true,
                            "bAutoWidth": false,
                            "bSortable": true,
                            //"bFilter": false,
                            "aLengthMenu": [10, 30, 50, 100],
                            "pageLength": 10,
                            "sAjaxSource": '@Url.Action("CustomerPortfolioData","CustomerManager")' + '?type=@item.GroupCode',
                            "fnServerData": function (sSource, aoData, fnCallback) {
                                $.ajax({
                                    "dataType": 'json',
                                    "type": "POST",
                                    "url": sSource,
                                    "data": aoData,
                                    "success": fnCallback
                                });
                            },
                            "sDom": "<'row-fluid'<'span6'l><'span6'f>r>t<'row-fluid'<'dataTables_wrapper'ip>>",
                            "sPaginationType": "simple_numbers",//"full_numbers",
                            "aoColumns": [
                                        { "sName": "CIF", "bSortable": false },
                                        { "sName": "NAME", "bSortable": false },
                                        { "sName": "VPB INDUSTRY", "bSortable": false },
                                        { "sName": "DATE OPEN CIF", "bSortable": false },
                                        { "sName": "BALANCE", "bSortable": false },
                                        { "sName": "INFO", "bSortable": false }],
                            "aoColumnDefs": [{
                                "aTargets": [5],
                                "mRender": function (data, type, full) {
                                    return '<a class=\"btn btn-primary btn-xs\" onclick=\"showCustomerInfo(\'' + full[0] + '\');\"><i class="fa fa-info"></i></a>';
                                }
                            }]
                        });

                        var data = [{ id: 0, text: decodeHtml('@SMEsCustomer360Degree.Core.Resources.Resource.Product') }, { id: 1, text: decodeHtml('@SMEsCustomer360Degree.Core.Resources.Resource.ProgrammeProduct') }];
                        $(".select2_group_@item.GroupCode").select2({
                            placeholder: "Select a group",
                            data: data,
                        });
                        var dataSearch_@item.GroupCode = [{ id: 0, text: 'CIF' }, { id: 1, text: 'Name' }, { id: 2, text: 'VPB Insdustry' }];
                        $(".search_column_@item.GroupCode").select2({
                            placeholder: "Select column",
                            data: dataSearch_@item.GroupCode
                        });

                        table.columns().every(function () {
                            var that = this;

                            $('#deposit_search_textbox').on('keyup change', function () {
                                if ($(".search_column_@item.GroupCode").val() == "") {
                                    $("#parsley_search_column_@item.GroupCode").show();
                                    this.value = "";
                                } else {
                                    if (that.index() == $(".search_column_@item.GroupCode").val()) {
                                        that.search(this.value).draw();
                                    }
                                }

                            });
                            $(".search_column_@item.GroupCode").on("change", function (e) {
                                $("#parsley_search_column_@item.GroupCode").hide();
                                $('#deposit_search_textbox').val('');
                                that.search('').draw();
                            });
                        });

                        var isFirst = true;
                        if (isFirst) {
                            $(".select2_group_element_@item.GroupCode").select2({
                                placeholder: "Choose group first",
                            });
                            isFirst = false;
                        }

                        $(".select2_group_@item.GroupCode").on("change", function (e) {
                            $(".select2_group_element_@item.GroupCode").empty();
                            $.ajax({
                                url: '@Url.Action("ListGroupItem", "CustomerManager")',
                                type: "POST",
                                data: { type: $(".select2_group_@item.GroupCode").val(), product: "deposit" },
                                success: function (data_response) {
                                    $(".select2_group_element_@item.GroupCode").select2({
                                        placeholder: "Select element",
                                        data: data_response,
                                    });
                                }
                            })
                        });
                    })
                </script>
                break;
            case "loan":
            <script type="text/javascript">
                $(document).ready(function () {
                    var typeLoan = 'loan';
                    function searchTextbox() {
                        var that = this;

                        $('#loan_search_textbox').on('keyup change', function () {
                            if ($(".search_column_@item.GroupCode").val() == "") {
                                $("#parsley_search_column_@item.GroupCode").show();
                                this.value = "";
                            } else {
                                if (that.index() == $(".search_column_@item.GroupCode").val()) {
                                    that.search(this.value).draw();
                                }
                            }

                        });
                        $(".search_column_@item.GroupCode").on("change", function (e) {
                            $("#parsley_search_column_@item.GroupCode").hide();
                            $('#loan_search_textbox').val('');
                            that.search('').draw();
                        });
                    }
                    $('#total-@item.GroupCode-lbl').click(function () {
                        typeLoan = 'loan';
                        var tableLoans = $('#cm-customer-portfolio-@item.GroupCode').DataTable({
                            "order": [[0, 'asc']],
                            "bServerSide": true,
                            "bProcessing": true,
                            "responsive": true,
                            "bAutoWidth": false,
                            "aLengthMenu": [10, 30, 50, 100],
                            "pageLength": 10,
                            "sAjaxSource": '@Url.Action("CustomerPortfolioData","CustomerManager")' + '?type=' + typeLoan,
                            "fnServerData": function (sSource, aoData, fnCallback) {
                                $.ajax({
                                    "dataType": 'json',
                                    "type": "POST",
                                    "url": sSource,
                                    "data": aoData,
                                    "success": fnCallback
                                });
                            },
                            "sDom": "<'row-fluid'<'span6'l><'span6'f>r>t<'row-fluid'<'dataTables_wrapper'ip>>",
                            "sPaginationType": "simple_numbers",//"full_numbers",
                            destroy: true,
                            "aoColumns": [
                                        { "sName": "CIF", "bSortable": false },
                                        { "sName": "NAME", "bSortable": false },
                                        { "sName": "VPB INDUSTRY", "bSortable": false },
                                        { "sName": "DATE OPEN CIF", "bSortable": true },
                                        { "sName": "BALANCE", "bSortable": false },
                                        { "sName": "INFO", "bSortable": false }],
                            "aoColumnDefs": [{
                                "aTargets": [5],
                                "mRender": function (data, type, full) {
                                    return '<a class=\"btn btn-primary btn-xs\" onclick=\"showCustomerInfo(\'' + full[0] + '\');\"><i class="fa fa-info"></i></a>';
                                }
                            }]
                        });
                        tableLoans.columns().every(searchTextbox);
                        $('#collapseOne-@item.GroupCode').collapse('show');
                    });
                    $('#new-@item.GroupCode-lbl').click(function () {
                        typeLoan = 'new_loan';
                        var table_new_loan = $('#cm-customer-portfolio-@item.GroupCode').DataTable({
                            "order": [[0, 'asc']],
                            "bServerSide": true,
                            "bProcessing": true,
                            "responsive": true,
                            "bAutoWidth": false,
                            "aLengthMenu": [10, 30, 50, 100],
                            "pageLength": 10,
                            "sAjaxSource": '@Url.Action("CustomerPortfolioData","CustomerManager")' + '?type=' + typeLoan,
                            "fnServerData": function (sSource, aoData, fnCallback) {
                                $.ajax({
                                    "dataType": 'json',
                                    "type": "POST",
                                    "url": sSource,
                                    "data": aoData,
                                    "success": fnCallback
                                });
                            },
                            "sDom": "<'row-fluid'<'span6'l><'span6'f>r>t<'row-fluid'<'dataTables_wrapper'ip>>",
                            "sPaginationType": "simple_numbers",//"full_numbers",
                            destroy: true,
                            "aoColumns": [
                                        { "sName": "CIF", "bSortable": false },
                                        { "sName": "NAME", "bSortable": false },
                                        { "sName": "VPB INDUSTRY", "bSortable": false },
                                        { "sName": "DATE OPEN CIF", "bSortable": true },
                                        { "sName": "BALANCE", "bSortable": false },
                                        { "sName": "INFO", "bSortable": false }],
                            "aoColumnDefs": [{
                                "width": "12%",
                                "aTargets": [5],
                                "mRender": function (data, type, full) {
                                    return '<a class=\"btn btn-primary btn-xs\" onclick=\"showCustomerInfo(\'' + full[0] + '\');\"><i class="fa fa-info"></i></a><a class=\"btn btn-primary btn-xs\" onclick=\"showNewLending(\'' + full[0] + '\');\"><i class="fa fa-folder-open" data-toggle="tooltip" data-placement="top" title="@SMEsCustomer360Degree.Core.Resources.Resource.TipForNewCustLoan" data-original-title="@SMEsCustomer360Degree.Core.Resources.Resource.TipForNewCustLoan"></i></a>';
                                }
                            }]
                        });

                        table_new_loan.$('td').tooltip({
                            "delay": 0,
                            "track": true,
                            "fade": 100
                        });
                        table_new_loan.columns().every(searchTextbox);
                        $('#collapseOne-@item.GroupCode').collapse('show');
                    });
                    $('#filter-loan').click(function () {
                        var table_filter_loan = $('#cm-customer-portfolio-@item.GroupCode').DataTable({
                            "order": [[0, 'asc']],
                            "bServerSide": true,
                            "bProcessing": true,
                            "responsive": true,
                            "bAutoWidth": false,
                            "aLengthMenu": [10, 30, 50, 100],
                            "pageLength": 10,
                            "sAjaxSource": '@Url.Action("CustomerPortfolioData","CustomerManager")' + '?type=' + typeLoan + '&group=' + $(".select2_group_@item.GroupCode").val() + '&grouptype=' + $(".select2_group_element_@item.GroupCode").val(),
                            "fnServerData": function (sSource, aoData, fnCallback) {
                                $.ajax({
                                    "dataType": 'json',
                                    "type": "POST",
                                    "url": sSource,
                                    "data": aoData,
                                    "success": fnCallback
                                });
                            },
                            "sDom": "<'row-fluid'<'span6'l><'span6'f>r>t<'row-fluid'<'dataTables_wrapper'ip>>",
                            "sPaginationType": "simple_numbers",//"full_numbers",
                            destroy: true,
                            "aoColumns": [
                                        { "sName": "CIF", "bSortable": false },
                                        { "sName": "NAME", "bSortable": false },
                                        { "sName": "VPB INDUSTRY", "bSortable": false },
                                        { "sName": "DATE OPEN CIF", "bSortable": true },
                                        { "sName": "BALANCE", "bSortable": false },
                                        { "sName": "INFO", "bSortable": false }],
                            "aoColumnDefs": [{
                                "aTargets": [5],
                                "mRender": function (data, type, full) {
                                    return '<a class=\"btn btn-primary btn-xs\" onclick=\"showCustomerInfo(\'' + full[0] + '\');\"><i class="fa fa-info"></i></a>';
                                }
                            }]
                        });
                        table_filter_loan.columns().every(searchTextbox);
                    });
                    var tableLoans = $('#cm-customer-portfolio-@item.GroupCode').DataTable({
                        "order": [[0, 'asc']],
                        "bServerSide": true,
                        "bProcessing": true,
                        "responsive": true,
                        "bAutoWidth": false,
                        "aLengthMenu": [10, 30, 50, 100],
                        "pageLength": 10,
                        "sAjaxSource": '@Url.Action("CustomerPortfolioData","CustomerManager")' + '?type=' + typeLoan,
                        "fnServerData": function (sSource, aoData, fnCallback) {
                            $.ajax({
                                "dataType": 'json',
                                "type": "POST",
                                "url": sSource,
                                "data": aoData,
                                "success": fnCallback
                            });
                        },
                        "sDom": "<'row-fluid'<'span6'l><'span6'f>r>t<'row-fluid'<'dataTables_wrapper'ip>>",
                        "sPaginationType": "simple_numbers",//"full_numbers",
                        "aoColumns": [
                                    { "sName": "CIF", "bSortable": false },
                                    { "sName": "NAME", "bSortable": false },
                                    { "sName": "VPB INDUSTRY", "bSortable": false },
                                    { "sName": "DATE OPEN CIF", "bSortable": true },
                                    { "sName": "BALANCE", "bSortable": false },
                                    { "sName": "INFO", "bSortable": false }],
                        "aoColumnDefs": [{
                            "aTargets": [5],
                            "mRender": function (data, type, full) {
                                return '<a class=\"btn btn-primary btn-xs\" onclick=\"showCustomerInfo(\'' + full[0] + '\');\"><i class="fa fa-info"></i></a>';
                            }
                        }]
                    });
                    var dataLoan = [{ id: 0, text: decodeHtml('@SMEsCustomer360Degree.Core.Resources.Resource.PreLoanProgram') }, { id: 1, text: decodeHtml('@SMEsCustomer360Degree.Core.Resources.Resource.ProgrammeProduct') }, { id: 2, text: '@SMEsCustomer360Degree.Core.Resources.Resource.Product' }];
                    $(".select2_group_@item.GroupCode").select2({
                        placeholder: "Select a group",
                        data: dataLoan,
                    });

                    var dataSearch_@item.GroupCode = [{ id: 0, text: 'CIF' }, { id: 1, text: 'Name' }, { id: 2, text: 'VPB Insdustry' }];
                    $(".search_column_@item.GroupCode").select2({
                        placeholder: "Select column",
                        data: dataSearch_@item.GroupCode
                    });

                    tableLoans.columns().every(searchTextbox);
                    var isFirstLoan = true;
                    if (isFirstLoan) {
                        $(".select2_group_element_@item.GroupCode").select2({
                            placeholder: "Please choose group first"
                        });
                        isFirstLoan = false;
                    }
                    $(".select2_group_@item.GroupCode").on("change", function (e) {
                        $(".select2_group_element_@item.GroupCode").empty();
                        $.ajax({
                            url: '@Url.Action("ListGroupItem", "CustomerManager")',
                            type: "POST",
                            data: { type: $(".select2_group_@item.GroupCode").val(), product: "loan" },
                            success: function (data_response) {
                                $(".select2_group_element_@item.GroupCode").select2({
                                    placeholder: "Select element",
                                    data: data_response,
                                });
                            }
                        })
                    });
                })
            </script>

                if (true)
                {
                    <script type="text/javascript">
                        function showNewLending(cif) {
                            var tableDetailNewLending = $('#cm-cp-tb-new-lending-detail').DataTable({
                                "bServerSide": true,
                                "bProcessing": true,
                                "responsive": true,
                                "bAutoWidth": false,
                                "aLengthMenu": [10, 30, 50, 100],
                                "pageLength": 10,
                                bFilter: false,
                                bInfo: false,
                                bPaginate: false,
                                "sAjaxSource": '@Url.Action("NewLending", "CustomerManager")' + '?cif=' + cif,
                                "fnServerData": function (sSource, aoData, fnCallback) {
                                    $.ajax({
                                        "dataType": 'json',
                                        "type": "POST",
                                        "url": sSource,
                                        "data": aoData,
                                        "success": fnCallback
                                    });
                                },
                                "sDom": "<'row-fluid'<'span6'l><'span6'f>r>t<'row-fluid'<'dataTables_wrapper'ip>>",
                                "sPaginationType": "simple_numbers",//"full_numbers",
                                destroy: true,
                                "aoColumns": [
                                            { "sName": "CIF", "bSortable": false },
                                            { "sName": "CUSTOMER NAME", "bSortable": false },
                                            { "sName": "CHUONG TRINH SP", "bSortable": false },
                                            { "sName": "DIST DATE", "bSortable": false },
                                            { "sName": "ACCTNO", "bSortable": false },
                                            { "sName": "BALANCE", "bSortable": false }],
                            });
                            $('.cm-cp-new-lending-detail').modal('show');
                        }
                    </script>
                }
                break;
            case "card":
            <script type="text/javascript">
                $(document).ready(function () {
                    $('#total-@item.GroupCode-lbl').click(function () {
                        $('#collapseOne-@item.GroupCode').collapse('show');
                    });
                    $('#new-@item.GroupCode-lbl').click(function () {
                        $('#collapseOne-@item.GroupCode').collapse('show');
                    });
                    var tablecard = $('#cm-customer-portfolio-@item.GroupCode').DataTable({
                        "order": [[0, 'asc']],
                        "bServerSide": true,
                        "bProcessing": true,
                        "responsive": true,
                        "bAutoWidth": false,
                        "aLengthMenu": [10, 30, 50, 100],
                        "pageLength": 10,
                        "sAjaxSource": '@Url.Action("CustomerPortfolioData","CustomerManager")' + '?type=@item.GroupCode',
                        "fnServerData": function (sSource, aoData, fnCallback) {
                            $.ajax({
                                "dataType": 'json',
                                "type": "POST",
                                "url": sSource,
                                "data": aoData,
                                "success": fnCallback
                            });
                        },
                        "sDom": "<'row-fluid'<'span6'l><'span6'f>r>t<'row-fluid'<'dataTables_wrapper'ip>>",
                        "sPaginationType": "simple_numbers",//"full_numbers",
                        "aoColumns": [
                                    { "sName": "CIF", "bSortable": false },
                                    { "sName": "NAME", "bSortable": false },
                                    { "sName": "VPB INDUSTRY", "bSortable": false },
                                    { "sName": "DATE OPEN CIF", "bSortable": false },
                                    { "sName": "CARD DEBIT", "bSortable": false },
                                    { "sName": "CARD CREDIT", "bSortable": false },
                                    { "sName": "CREDIT BALANCE", "bSortable": false },
                                    { "sName": "INFO", "bSortable": false }],
                        "aoColumnDefs": [{
                            "aTargets": [7],
                            "mRender": function (data, type, full) {
                                return '<a class=\"btn btn-primary btn-xs\" onclick=\"showCustomerInfo(\'' + full[0] + '\');\"><i class="fa fa-info"></i></a>';
                            }
                        }]
                    });

                    var dataSearch_@item.GroupCode = [{ id: 0, text: 'CIF' }, { id: 1, text: 'Name' }, { id: 2, text: 'VPB Insdustry' }];
                    $(".search_column_@item.GroupCode").select2({
                        placeholder: "Select column",
                        data: dataSearch_@item.GroupCode
                    });

                    tablecard.columns().every(function () {
                        var that = this;

                        $('#card_search_textbox').on('keyup change', function () {
                            if ($(".search_column_@item.GroupCode").val() == "") {
                                $("#parsley_search_column_@item.GroupCode").show();
                                this.value = "";
                            } else {
                                if (that.index() == $(".search_column_@item.GroupCode").val()) {
                                    that.search(this.value).draw();
                                }
                            }

                        });
                        $(".search_column_@item.GroupCode").on("change", function (e) {
                            $("#parsley_search_column_@item.GroupCode").hide();
                            $('#card_search_textbox').val('');
                            that.search('').draw();
                        });
                    });
                })
            </script>
                break;
            case "i2b":
            <script type="text/javascript">
                $(document).ready(function () {
                    $('#total-@item.GroupCode-lbl').click(function () {
                        $('#collapseOne-@item.GroupCode').collapse('show');
                    });
                    $('#new-@item.GroupCode-lbl').click(function () {
                        $('#collapseOne-@item.GroupCode').collapse('show');
                    });
                    var tableI2B = $('#cm-customer-portfolio-@item.GroupCode').DataTable({
                        "order": [[0, 'asc']],
                        "bServerSide": true,
                        "bProcessing": true,
                        "responsive": true,
                        "bAutoWidth": false,
                        "aLengthMenu": [10, 30, 50, 100],
                        "pageLength": 10,
                        "sAjaxSource": '@Url.Action("CustomerPortfolioData","CustomerManager")' + '?type=@item.GroupCode',
                        "fnServerData": function (sSource, aoData, fnCallback) {
                            $.ajax({
                                "dataType": 'json',
                                "type": "POST",
                                "url": sSource,
                                "data": aoData,
                                "success": fnCallback
                            });
                        },
                        "sDom": "<'row-fluid'<'span6'l><'span6'f>r>t<'row-fluid'<'dataTables_wrapper'ip>>",
                        "sPaginationType": "simple_numbers",//"full_numbers",
                        "aoColumns": [
                                    { "sName": "CIF", "bSortable": false },
                                    { "sName": "NAME", "bSortable": false },
                                    { "sName": "VPB INDUSTRY", "bSortable": false },
                                    { "sName": "DATE OPEN CIF", "bSortable": false },
                                    { "sName": "NO USER", "bSortable": false },
                                    { "sName": "INFO", "bSortable": false }],
                        "aoColumnDefs": [{
                            "aTargets": [4],
                            "mRender": function (data, type, full) {
                                return '<a class=\"\" onclick=\"showDetailCustomerI2B(\'' + full[0] + '\');\">' + full[4] + '</a>';
                            }
                        }, {
                            "aTargets": [5],
                            "mRender": function (data, type, full) {
                                return '<a class=\"btn btn-primary btn-xs\" onclick=\"showCustomerInfo(\'' + full[0] + '\');\"><i class="fa fa-info"></i></a>';
                            }
                        }]
                    });
                    var dataSearch_@item.GroupCode = [{ id: 0, text: 'CIF' }, { id: 1, text: 'Name' }, { id: 2, text: 'VPB Insdustry' }];
                    $(".search_column_@item.GroupCode").select2({
                        placeholder: "Select column",
                        data: dataSearch_@item.GroupCode
                    });

                    tableI2B.columns().every(function () {
                        var that = this;

                        $('#i2b_search_textbox').on('keyup change', function () {
                            if ($(".search_column_@item.GroupCode").val() == "") {
                                $("#parsley_search_column_@item.GroupCode").show();
                                this.value = "";
                            } else {
                                if (that.index() == $(".search_column_@item.GroupCode").val()) {
                                    that.search(this.value).draw();
                                }
                            }

                        });
                        $(".search_column_@item.GroupCode").on("change", function (e) {
                            $("#parsley_search_column_@item.GroupCode").hide();
                            $('#i2b_search_textbox').val('');
                            that.search('').draw();
                        });
                    });
                })
            </script>
                if (true)
                {
                    <script type="text/javascript">
                        function showDetailCustomerI2B(cif) {
                            var tableDetailCustomerI2B = $('#cm-cp-tb-@item.GroupCode-detail').DataTable({
                                "bServerSide": true,
                                "bProcessing": true,
                                "responsive": true,
                                "bAutoWidth": false,
                                "aLengthMenu": [10, 30, 50, 100],
                                "pageLength": 10,
                                bFilter: false,
                                bInfo: false,
                                bPaginate: false,
                                "sAjaxSource": '@Url.Action("CustomerI2BDetailData", "CustomerManager")' + '?cif=' + cif,
                                "fnServerData": function (sSource, aoData, fnCallback) {
                                    $.ajax({
                                        "dataType": 'json',
                                        "type": "POST",
                                        "url": sSource,
                                        "data": aoData,
                                        "success": fnCallback
                                    });
                                },
                                "sDom": "<'row-fluid'<'span6'l><'span6'f>r>t<'row-fluid'<'dataTables_wrapper'ip>>",
                                "sPaginationType": "simple_numbers",//"full_numbers",
                                destroy: true,
                                "aoColumns": [
                                            { "sName": "CIF", "bSortable": false },
                                            { "sName": "USERNAME", "bSortable": false },
                                            { "sName": "STATUS", "bSortable": false }],
                            });
                            $('.cm-cp-@item.GroupCode-detail').modal('show');
                        };
                    </script>
                }
                break;
            case "pos":
            <script type="text/javascript">
                $(document).ready(function () {
                    $('#total-@item.GroupCode-lbl').click(function () {
                        $('#collapseOne-@item.GroupCode').collapse('show');
                    });
                    $('#new-@item.GroupCode-lbl').click(function () {
                        $('#collapseOne-@item.GroupCode').collapse('show');
                    });
                    var tablepos = $('#cm-customer-portfolio-@item.GroupCode').DataTable({
                        "order": [[0, 'asc']],
                        "bServerSide": true,
                        "bProcessing": true,
                        "responsive": true,
                        "bAutoWidth": false,
                        "aLengthMenu": [10, 30, 50, 100],
                        "pageLength": 10,
                        "sAjaxSource": '@Url.Action("CustomerPortfolioData","CustomerManager")' + '?type=@item.GroupCode',
                        "fnServerData": function (sSource, aoData, fnCallback) {
                            $.ajax({
                                "dataType": 'json',
                                "type": "POST",
                                "url": sSource,
                                "data": aoData,
                                "success": fnCallback
                            });
                        },
                        "sDom": "<'row-fluid'<'span6'l><'span6'f>r>t<'row-fluid'<'dataTables_wrapper'ip>>",
                        "sPaginationType": "simple_numbers",//"full_numbers",
                        "aoColumns": [
                                    { "sName": "CIF", "bSortable": false },
                                    { "sName": "NAME", "bSortable": false },
                                    { "sName": "VPB INDUSTRY", "bSortable": false },
                                    { "sName": "DATE OPEN CIF", "bSortable": false },
                                    { "sName": "NO POS", "bSortable": false },
                                    { "sName": "TRANSACTION IN MONTH", "bSortable": false },
                                    { "sName": "ADDRESS", "bSortable": false }],
                        "aoColumnDefs": [{
                            "aTargets": [6],
                            "mRender": function (data, type, full) {
                                return '<a class=\"btn btn-primary btn-xs\" onclick=\"showCustomerInfo(\'' + full[0] + '\');\"><i class="fa fa-info"></i></a>';
                            }
                        }]
                    });
                    var dataSearch_@item.GroupCode = [{ id: 0, text: 'CIF' }, { id: 1, text: 'Name' }, { id: 2, text: 'VPB Insdustry' }];
                    $(".search_column_@item.GroupCode").select2({
                        placeholder: "Select column",
                        data: dataSearch_@item.GroupCode
                    });

                    tablepos.columns().every(function () {
                        var that = this;

                        $('#pos_search_textbox').on('keyup change', function () {
                            if ($(".search_column_@item.GroupCode").val() == "") {
                                $("#parsley_search_column_@item.GroupCode").show();
                                this.value = "";
                            } else {
                                if (that.index() == $(".search_column_@item.GroupCode").val()) {
                                    that.search(this.value).draw();
                                }
                            }

                        });
                        $(".search_column_@item.GroupCode").on("change", function (e) {
                            $("#parsley_search_column_@item.GroupCode").hide();
                            $('#pos_search_textbox').val('');
                            that.search('').draw();
                        });
                    });
                })
            </script>
                break;
            default:

                break;
        }
    }
    <!-- Ion.RangeSlider -->
    <script>
        $(document).ready(function () {
            $("#range_25").ionRangeSlider({
                type: "double",
                keyboard: true,
                step: 100000,
                min: 0,
                max: 1000000000,
                grid: true
            });
        });
    </script>
    <!-- /Ion.RangeSlider -->
    @if (true)
    {
        <script type="text/javascript">
            function showCustomerInfo(cif) {
                $.ajax({
                    url: '@Url.Action("CustomerInfo", "CustomerManager")',
                    type: "POST",
                    data: { cif: cif },
                    success: function (data_response) {
                        if (data_response.length > 0) {
                            var dataInfo = data_response[0];
                            $('#cust_info_industry').text(dataInfo['industry']);
                            $('#cust_info_name').text(dataInfo['custName']);
                            $('#cust_info_address').text(dataInfo['address']);
                            $('#cust_info_phone').text(dataInfo['phone']);
                            $('#cust_info_fax').text(dataInfo['fax']);
                            $('#cust_info_office').text(dataInfo['office']);
                            $('#cust_info_landline').text(dataInfo['landLine']);
                            $('#cust_info_email').text(dataInfo['email']);
                        }
                        $('.cm-cp-customer-info').modal('show');
                    }
                })

            };
        </script>
    }
}